<template>
	<view>
		<view class="headInfo">
			<!-- 头部 -->
			<image src="../../../../static/user/img_wodeqbbj.png" mode="" class="head"></image>
			<dsl-navbar :bgTopImg='bgTopImg' title="我的钱包" isBack="true" :textTitle='textTitle'
				:backBg="titleRightStyle"></dsl-navbar>
			<view class="head_position rowsb">
				<view>
					<view class="head_title">账户余额(元)</view>
					<view class="head_pay">{{ money ||0}}</view>
				</view>
				<view class="head_withdraw" @click="$tools.push('/pages/user/modules/wallet/withdraw')">
					申请提现
				</view>
			<!-- 	<view class="head_withdraw2" @click="$tools.push('/pages/user/wallet/particulars')">
					提现明细
				</view> -->
			</view>
		</view>
		<view class=" solid-bottom padding rowsb align-center" v-for="(item,inedx) in userMoneyList"  :key="index">
			<view>
				<view class="detailList_title">提现方式：{{item.type}}</view>
				<view class="detailList_date">{{item.createTime}}</view>
			</view>
			<view class="detailList_num">
				<text v-if="num==0">-</text>
				<text v-if="num==1">+</text>
				￥{{item.amount || 0}}</view>
		</view>

	</view>
</template>
<script>
	import {get_withdrawalRecord} from '../../../../common/path.js'
	export default {
		data() {
			return {
				money:uni.getStorageSync('userInfo').money,
				isLoding: true,
				num: 0,
				bgTopImg: 'rgba(255, 255, 255, 0.0)',
				textTitle: '#FFFFFF',
				titleRightStyle: '#FFFFFF',
				classfiyList: [{
						name: '收入明细',
						id: 1
					},
					{
						name: '支付明细',
						id: 2
					}
				],
				pageData: 1, //第一页支出
				userMoneyList:[],//我的钱包明细
 
				 
			}
		},
		onShow() {
			this.get_withdrawalRecord() //明细列表
		},
		methods: {
			//明细列表
			get_withdrawalRecord(){
				let data ={
					userId:uni.getStorageSync('userInfo').id,
					pageNum:1,
					pageSize:9999,
				}
				this.Http.POST(get_withdrawalRecord,data)
				.then((res)=>{
					console.log('[明细列表]',res);
					if(res.code == 0) {
						this.userMoneyList = res.data
					}
				})
			},
			//切换
			classfiyMen(index, id) {
				this.num = index
				this.pageData =1
			},
			//滑动完成后触发
			onPageScroll(event) {
				// console.log(event.scrollTop);
				let backImg
				if (event) {
					backImg = `rgba(255, 255, 255, ${(event.scrollTop-100)/20})`
					if ((event.scrollTop - 100) / 20 > 0.3) {
						this.textTitle = 'gray'
						this.titleRightStyle = 'gray'
					} else if ((event.scrollTop - 100) / 20 > 0.7) {
						this.textTitle = '#000000'
						this.titleRightStyle = '#000000'
					} else {
						this.textTitle = '#FFFFFF'
						this.titleRightStyle = '#FFFFFF'
					}
					// console.log('多少',backImg);
				} else {
					backImg = `rgba(255, 255, 255, ${(event.scrollTop-100)/20})`
				}
				this.bgTopImg = backImg;
			}
		}
	}
</script>

<style>
	.head {
		width: 750rpx;
		height: 400rpx;
		position: relative;
	}

	.head_pay {
		font-size: 72rpx;
		color: #FFFFFF;
	}

	.headInfo {
		width: 750rpx;
		height: 400rpx;
		position: relative;
	}

	.head_title {
		font-size: 28rpx;
		font-weight: bold;
		line-height: 86rpx;
		color: #FFFFFF;
	}

	.head_position {
		width: 100%;
		position: absolute;
		padding-left: 30rpx;
		display: flex;
		align-items: center;
		z-index: 1;
		bottom: 100rpx;
	}

	.head_withdraw {
		width: 176rpx;
		height: 53rpx;
		background: #FF6600;
		border-radius: 30rpx 0rpx 0rpx 30rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 28rpx;
		color: #FFFFFF;
	}

	.head_withdraw2 {

		width: 176rpx;
		height: 53rpx;
		background: #FF6600;
		border-radius: 30rpx 0rpx 0rpx 30rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 28rpx;
		color: #FFFFFF;
		position: absolute;
		right: 0;
		top: 160rpx;
	}

	/* 明细 */
	.detailList_title {
		font-size: 30rpx;
		font-weight: bold;
		color: #06121E;
	}

	.detailList_date {
		font-size: 24rpx;
		font-weight: 500;
		margin-top: 10rpx;
		color: #5B5E63;
	}

	.detailList_num {
		font-size: 35rpx;
		color: #FE3F10;
	}
</style>
